/**
 * Created with Vim7.3 Mac
 * @fileOverview : 
 * @author : Lyle lylechen2014@gmail.com
 * @since : 2016-07-11 15:32:18
 * @filename : src/components/letsMeet.js
 * @version : 
 * @description : 
 */

import React, { Component } from 'react';
import {
    StyleSheet,
    Text,
    View,
    Image,
    TouchableOpacity
} from 'react-native';


import SliderCards from './sliderCards'
import Matches from './matches';

let { width, height } = Utils.size;

class LetsMeet extends Component {

    constructor(props) {
        super(props);
        SceneObj.LetsMeet = this;
        this.state = {
            cards: [
                { picture : "https://www.masonsoft.com/de/picssb75/3/273/1602273-1063965.jpg" },
                { picture : "https://www.masonsoft.com/de/picssb75/8/298/1586298-1047775.jpg" },
                { picture : "https://www.masonsoft.com/de/picssb75/5/415/1698415-1115816.jpg" },
                { picture : "https://www.masonsoft.com/de/picssb75/4/684/1680684-1080562.jpg" },
                { picture : "https://www.masonsoft.com/de/picssb75/2/772/1708772-1126340.jpg" },
                { picture : "https://www.masonsoft.com/de/picssb75/4/244/1672244-1090075.jpg" },
                { picture : "https://www.masonsoft.com/de/picssb75/0/770/1705770-1128129.jpg" },  
                { picture : "https://www.masonsoft.com/de/picssb75/9/319/1601319-1114856.jpg" },         
            ],
        };
        /*
        this.state = {
            cards: {},
            isLoading: true,
        };
        */
    }

    componentDidMount() {
        this.getRecommendUser();
    }

    getRecommendUser() {
        let tthis = this;
        Share.fetchMain({
            url: 'meet_recommend',
            data: { restart: 0 },
            callback: function (data) {
                console.log(57,data);
                tthis.setState({
                    cards: data.res,
                    isLoading: false,
                })
            }
        })
    }

    rightButton() {
        Utils.navJumpTo(this.props.navigator,
            {
                name: "Matches",
                component: Matches,
                title: 'Matches',
            }
        )
    }

    render() {
        
        return (
            <View style={styles.container}>  
                <Text style={styles.title}> Swipe right to like </Text>
                <View style={styles.box}>
                    <View style={styles.cards}>
                       <SliderCards cardList = {this.state.cards} />
                    </View>
                </View>
            </View>
        )
    }
}

const styles = StyleSheet.create({

    container: {
        flex: 1,
        width:width,
        height:height,
        backgroundColor: '#f5f7f8',
    },

    box: {
        flex: 1,
        alignItems:'center',
        /*justifyContent: 'center',*/
    },

    title: {
        height:40,
        lineHeight:30, 
        textAlign:'center',
        color:'#ccc',
        fontSize:13,
    },

    cards: {
        width:300,
        height:480,
        borderColor:'#ccc',
    },

});



export default LetsMeet;